import React from 'react'

import { Button } from 'antd'

import { connect } from 'react-redux'

import {addAction} from '../store/actionCreators'

function Home(props) {
  return (
    <div>
      Home
      <h3>当前计数: {props.counter}</h3>
      <Button type="primary" onClick={(e) => props.addNumber(1)}>+1</Button>
      <Button type="primary" onClick={(e) => props.addNumber(5)}>+5</Button>
    </div>
  )
}

const mapStateToProps = (storeState) => ({
  counter: storeState.counter // 获取store中的count值
})
const mapDispatchToProps = (storeDispatch) => {
  return {
    addNumber: (num) => storeDispatch(addAction(num))  // 定义dispatchAction方法
  }
}

export default connect(mapStateToProps, mapDispatchToProps)(Home)
